<template>
  <BasicModal :show="show" :title="type === 'fsyj' ? '发送培训邮件' : '重发邮件'" width="30%" :widthComfirm="true"
    @comfirm="comfirm" @closeModal="closeModal">
    <template #content>
      <div class="btns">
        <Button size="small" class="copy" @click="copy" color="success">复制</Button>
        <Button size="small" @click="paste" color="error">粘贴</Button>
      </div>
      <CommonForm :formList="formList" labelWidth="100px"  ref="formRef"></CommonForm>
    </template>
  </BasicModal>

  <BasicModal :show="showPreview" title="培训邮件预览" width="70%" :loading="loading" :widthComfirm="true"
    @comfirm="comfirmSend" @closeModal="closePreviewModal">
    <template #content>
      <div class="agreement">
        <div class="content">
          <div v-for="(item) in contentList" v-html="item == 'null' ? '' : item"
            :class="['items', item == 'null' ? 'mt-30' : '']" :key="item">
          </div>
        </div>
      </div>
    </template>
  </BasicModal>
</template>

<script setup lang='ts'>
import { Button } from "@/components/Button";
import CommonForm from '@/views/applicationDetails/CommonForm.vue';
import BasicModal from "./BasicModal.vue";
import { copyText } from '@/utils/copyTextToClipboard'
import { ref, nextTick, watch } from "vue"
import type { IndexFormItem } from "@/views/ApplicationDetails/application-type.ts"
import { message } from "ant-design-vue";
import { trainingEmailSent, selectCommonConfigDetail } from "@/api/application-details/index.ts";
import { sendTrainingEmail } from '@/api/applay/applicationList/self'
import { comStores } from '@/store/common/comStore';
import { progressIndex, selectTrainingNumberFoTime } from "@/api/application-details/index";
import { getImageUrl } from "@/assets/common/common.ts";
import getEmailDetail from "@/assets/tool/email.ts"
const store = comStores()
const { userInFor } = store


const show = ref<boolean>(false);
const showPreview = ref<boolean>(false);
const loading = ref<boolean>(false)
const paramsList = () => ([
  { label: "报到地点", name: "reportPlace", value: "", component: 'textarea' },
  // { label: "酒店地点", name: "hotelPlace", value: "", component: 'input' },
  // { label: "酒店电话", name: "hotelNumber", value: "", component: 'input' },
])
const formList = ref<IndexFormItem[]>(paramsList())
watch(() => show.value, async (val) => {
  if (val) {
    getData()
  }
})
const mailInfo = ref<any>({})
const getData = async () => {
  const data = await selectTrainingNumberFoTime({ trainingNumberId: info.value.trainingId });
  if (data && data.code == '10000') {
    mailInfo.value = data.data
  } else {
    message.error(data.msg)
  }
}
const formRef = ref<any>(null)
const formInfo = ref<any>({})
const trainingSchoolName = ref();
const comfirm = async () => {
  const res = await formRef.value.submitForm();
  console.log(res, 'res')
  let obj = {}
  res.forEach(el => {
    obj[el.name] = el.value
  })
  formInfo.value = obj;
  // trainingSchoolName.value = formList.value[8].options.filter(item => item.value === formInfo.value.trainingSchool)[0].label
  show.value = false;
  getContentList()
  await nextTick()
  console.log(formInfo.value)
  showPreview.value = true
}
const emits = defineEmits(['onSuccess'])
const comfirmSend = async () => {
  console.log('发送培训邮件预览')
  try {
    const { reportPlace, reportTime, hotelPlace, hotelNumber, offerTime, trainArea, ddValidity } = formInfo.value
    let params = {
      "resumeId": info.value.id,
      "processId": info.value.processId,
      "result": "通过",
      "operator": userInFor.userName,
      "reportAddress": reportPlace,
      "hotel": hotelPlace,
      "hotelPhone": hotelNumber,
    }
    loading.value = true
    const data = type.value === 'fsyj' ? await trainingEmailSent(params) : await sendTrainingEmail(params);
    loading.value = false
    if (data && data.code == '10000') {
      message.success("发送成功");
      emits('onSuccess')
      showPreview.value = false;
      show.value = false;
      formList.value = paramsList()
    } else {
      message.error(data.msg)
    }
  } catch (e) {
    console.log('错误', e)
  }

}

const closePreviewModal = () => {
  console.log('closePreviewModal')
  showPreview.value = false
}
const contentList = ref<string[]>([]);

const getContentList = async() => {
  contentList.value =await getEmailDetail(info.value.name,formInfo.value,mailInfo.value)
}
const pindexList = ref<number[]>([4, 5, 11, 14, 21, 24, 27, 30])
const copy = () => {
  let obj = {}
  formList.value.forEach(el => {
    obj[el.name] = el.value
  })
  copyText(JSON.stringify(obj))
}

const paste = async () => {
  const text = await navigator.clipboard.readText();
  let obj = JSON.parse(text);
  for (const key in obj) {
    const el = obj[key];
    formList.value.forEach(a => {
      if (a.name === key) {
        a.value = el
      }
    })
  }
}
const info = ref<any>({});
const type = ref();
const open = (params: Object) => {
  info.value = params.info
  type.value = params.type
  console.log('打开弹框', params.info)
  show.value = true
}
const closeModal = () => {
  show.value = false
  formList.value = paramsList()
  formRef.value.clear()
}
defineExpose({ open })
</script>

<style lang="less" scoped>
.content {
  .items {
    margin-top: 5px;
  }
}

.mt-30 {
  margin-top: 20px !important;
}

.btns {
  position: absolute;
  right: 45px;
  top: 16px;

  .copy {
    margin-right: 10px;
    align-items: center;
  }
}
</style>
